<template>
  <div id="job">
    <Breadcrumb content="定时任务" />
    <div class="bodyContent">
      <el-tabs type="border-card">
        <el-tab-pane label="任务配置">
          <div class="contentDiv">
            <vxe-toolbar perfect>
              <template #buttons>
                <vxe-form :data="queryParams" ref="queryForm" :inline="true">
                  <vxe-form-item title="任务名称" clearable>
                    <vxe-input v-model="queryParams.jobName" placeholder="请输入任务名称" clearable style="width: 200px" />
                  </vxe-form-item>
                  <vxe-form-item title="任务组名">
                    <vxe-select v-model="queryParams.jobGroup" placeholder="请选择任务组名" clearable>
                      <vxe-option v-for="(stageType, index) in groupList" :key="index" :value="stageType.code" :label="stageType.name"></vxe-option>
                    </vxe-select>
                  </vxe-form-item>
                  <vxe-form-item title="任务状态" field="status">
                    <vxe-select v-model="queryParams.status" placeholder="请选择任务状态" clearable>
                      <vxe-option v-for="(status, index) in statusList" :key="index" :value="status.value" :label="status.name"></vxe-option>
                    </vxe-select>
                  </vxe-form-item>
                  <vxe-form-item>
                    <vxe-button content="重置条件" type="text" class="button-blue" @click="resetQuery" icon="vxe-icon-refresh"></vxe-button>
                    <vxe-button content="查询数据" type="text" class="button-blue" @click="handleQuery" icon="vxe-icon-search"></vxe-button>
                  </vxe-form-item>
                  <vxe-form-item>
                    <vxe-button content="新增" type="text" class="button-blue" icon="vxe-icon-add" @click="handleAdd"> </vxe-button>
                  </vxe-form-item>
                </vxe-form>
              </template>
            </vxe-toolbar>

            <div class="tableBox">
              <vxe-table ref="tableRef" :span-method="mergeRowMethod" :data="jobList" class="mytable-scrollbar" border="inner" align="left" height="auto" :loading="tableLoading" :row-config="{ isCurrent: true, isHover: true }" :column-config="{ resizable: true }" resizable show-overflow keep-source>
                <vxe-column title="任务组名" field="jobGroupName" width="120"></vxe-column>
                <vxe-column title="任务编号" width="120" field="id" />
                <vxe-column title="任务名称" field="jobName" :show-overflow-tooltip="true" />
                <vxe-column title="调用目标字符串" field="invokeTarget" :show-overflow-tooltip="true" />
                <vxe-column title="cron执行表达式" field="cronExpression" :show-overflow-tooltip="true" />
                <vxe-column title="状态">
                  <template #default="{ row }">
                    <vxe-switch v-model="row.status" open-value="0" close-value="1" @change="handleStatusChange(row)"></vxe-switch>
                  </template>
                </vxe-column>
                <vxe-column title="操作" align="center">
                  <template #default="{ row }">
                    <vxe-button type="text" status="primary" icon="vxe-icon-edit" circle @click="handleUpdate(row)"> </vxe-button>
                    <vxe-button type="text" status="danger" icon="vxe-icon-delete" circle @click="handleDelete(row)"> </vxe-button>

                    <el-dropdown @command="(command) => handleCommand(command, row)">
                      <vxe-button content="更多" status="primary" type="text" icon="vxe-icon-arrow-down"> </vxe-button>
                      <template #dropdown>
                        <el-dropdown-menu>
                          <el-dropdown-item command="handleRun" :icon="CaretRight">执行一次</el-dropdown-item>

                          <el-dropdown-item command="handleView" :icon="View">任务详细</el-dropdown-item>
                        </el-dropdown-menu>
                      </template>
                    </el-dropdown>
                  </template>
                </vxe-column>
              </vxe-table>
            </div>

            <!-- 添加或修改定时任务对话框 -->
            <el-dialog :title="title" v-model="open" width="650px" class="addEditTaskDialog" append-to-body>
              <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="任务名称" prop="jobName">
                      <el-input v-model="form.jobName" placeholder="请输入任务名称" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="任务分组" prop="jobGroup">
                      <el-select v-model="form.jobGroup" placeholder="请选择任务组名" clearable>
                        <el-option v-for="(stageType, index) in groupList" :key="index" :value="stageType.code" :label="stageType.name"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item prop="invokeTarget">
                      <template #label>
                        <span style="display: inline-block">
                          调用方法
                          <el-tooltip placement="top">
                            <template #content>
                              Bean调用示例：ryTask.ryParams('ry')
                              <br />Class类调用示例：com.ruoyi.quartz.task.RyTask.ryParams('ry') <br />参数说明：支持字符串，布尔类型，长整型，浮点型，整型
                            </template>
                            <el-icon>
                              <QuestionFilled />
                            </el-icon>
                          </el-tooltip>
                        </span>
                      </template>
                      <template #default>
                        <el-input v-model="form.invokeTarget" placeholder="请输入调用目标字符串" />
                      </template>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="cron表达式" prop="cronExpression">
                      <el-input v-model="form.cronExpression" placeholder="请输入cron执行表达式"> </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="执行策略" prop="misfirePolicy">
                      <el-radio-group v-model="form.misfirePolicy" size="small">
                        <el-radio-button label="1">立即执行</el-radio-button>
                        <el-radio-button label="2">执行一次</el-radio-button>
                        <el-radio-button label="3">放弃执行</el-radio-button>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="状态">
                      <el-radio-group v-model="form.status" size="small">
                        <el-radio-button label="0">允许</el-radio-button>
                        <el-radio-button label="1">禁止</el-radio-button>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
              <div class="dialogFooter">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
              </div>
            </el-dialog>

            <!-- 任务日志详细 -->
            <el-dialog title="任务详细" v-model="openView" width="800px" class="taskLogDetailDialog" append-to-body>
              <el-form ref="formRef2" :model="form" label-width="120px">
                <el-descriptions class="margin-top" :column="2" border>
                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">任务编号：</div>
                    </template>
                    {{ form.id }}
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">任务分组</div>
                    </template>
                    <el-select v-model="form.jobGroup" placeholder="请选择任务组名" clearable>
                      <el-option v-for="(stageType, index) in groupList" :key="index" :value="stageType.code" :label="stageType.name"></el-option>
                    </el-select>
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">任务名称：</div>
                    </template>
                    {{ form.jobName }}
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">创建时间：</div>
                    </template>
                    <el-tag>
                      {{ form.createTime }}
                    </el-tag>
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">cron表达式：</div>
                    </template>
                    {{ form.cronExpression }}
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">调用目标方法：</div>
                    </template>
                    {{ form.invokeTarget }}
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">任务状态：</div>
                    </template>

                    <div v-if="form.status == 0">
                      <el-tag type="success">启用</el-tag>
                    </div>
                    <div v-else-if="form.status == 1">
                      <el-tag type="danger">禁用</el-tag>
                    </div>
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">是否并发：</div>
                    </template>
                    <div v-if="form.concurrent == 0">
                      <el-tag type="success">允许</el-tag>
                    </div>
                    <div v-else-if="form.concurrent == 1">
                      <el-tag type="danger">禁止</el-tag>
                    </div>
                  </el-descriptions-item>

                  <el-descriptions-item>
                    <template #label>
                      <div class="cell-item">执行策略：</div>
                    </template>
                    <div v-if="form.misfirePolicy == 0">
                      <el-tag type="primary">默认策略</el-tag>
                    </div>
                    <div v-else-if="form.misfirePolicy == 1">
                      <el-tag type="success">立即执行</el-tag>
                    </div>
                    <div v-else-if="form.misfirePolicy == 2">
                      <el-tag type="warning">执行一次</el-tag>
                    </div>
                    <div v-else-if="form.misfirePolicy == 3">
                      <el-tag type="danger"> 放弃执行</el-tag>
                    </div>
                  </el-descriptions-item>
                </el-descriptions>
              </el-form>
              <div class="dialogFooter">
                <el-button @click="cancel">关 闭</el-button>
              </div>
            </el-dialog>
          </div>
        </el-tab-pane>
        <el-tab-pane label="指标项目维护">
          <Splitpanes class="area">
            <Pane size="30">
              <vxe-toolbar perfect>
                <template #buttons>
                  <vxe-input v-model="searchForm.rptSearchValue" type="search" clearable class="vxeInputSearch" placeholder="关键字查询" @clear="getJobList" @search-click="getJobList()"></vxe-input>
                  <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="showLoading" @click="getJobList"></vxe-button>
                </template>
              </vxe-toolbar>
              <div class="leftTable">
                <vxe-table ref="labJobTable" border class="mytable-scrollbar" show-header-overflow show-overflow align="center" height="auto" :row-config="{ isCurrent: true, isHover: true }" @current-change="rptRowClick" :data="jobTableList" :loading="showLoading">
                  <vxe-column field="jobName" title="任务名称"></vxe-column>
                  <vxe-column field="jobGroupName" title="任务组名"></vxe-column>
                  <vxe-column field="invokeTarget" title="调用目标"></vxe-column>
                </vxe-table>
              </div>
            </Pane>
            <Pane size="35">
              <vxe-toolbar perfect>
                <template #buttons>
                  <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="showLoading" @click="getJobList"></vxe-button>
                </template>
              </vxe-toolbar>

              <div class="leftTable">
                <vxe-table ref="rptVsBarCodeTable" height="auto" border class="mytable-scrollbar" show-header-overflow show-overflow align="center" :row-config="{ isCurrent: true, isHover: true }" :data="jobVsMainItemList" :loading="showLoading" @cell-dblclick="deleteQiJobVsMainitem">
                  <vxe-column field="indexName" title="指标名称"></vxe-column>
                  <vxe-column field="itemName" title="项目名称"></vxe-column>
                </vxe-table>
              </div>
            </Pane>
            <Pane size="35">
              <vxe-toolbar perfect>
                <template #buttons>
                  <vxe-input v-model="searchValue" type="search" clearable class="vxeInputSearch" placeholder="关键字查询" @clear="getJobList" @search-click="getJobList()"></vxe-input>
                  <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="showLoading" @click="getJobList"></vxe-button>
                </template>
              </vxe-toolbar>
              <div class="leftTable">
                <vxe-table ref="barCodeTypeTable" height="auto" border class="mytable-scrollbar" show-header-overflow show-overflow align="center" :row-config="{ isCurrent: true, isHover: true }" @cell-dblclick="mainItemRowClick" :data="mainItemAllList" :loading="showLoading">
                  <vxe-column field="indexName" title="指标名称"></vxe-column>
                  <vxe-column field="itemName" title="项目名称"></vxe-column>
                </vxe-table>
              </div>
            </Pane>
          </Splitpanes>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script setup lang="ts">
// 引入组件区==========
import { getCurrentInstance, onMounted, reactive, ref } from 'vue';
import Breadcrumb from '@/components/Breadcrumb.vue'; //面包屑
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage';
import { CaretRight, View } from '@element-plus/icons-vue';
import { IsEmpty, formatDateTime } from '@/utils/common.ts';
import { Splitpanes, Pane } from 'splitpanes';
// 全局变量定义区 ==========
let { proxy }: any = getCurrentInstance();

const val1 = ref(); //选择任务名
const val2 = ref(); //选择任务名

let tableLoading = ref(true); //表格加载状态

let ids: any = reactive([]); //选中数组
let groupList = reactive([]);
let statusList = reactive([
  {
    value: 0,
    name: '启用'
  },
  {
    value: 1,
    name: '禁用'
  }
]);
let single = ref(true); //非单个禁用
let multiple = ref(true); //非多个禁用
let showSearch = ref(true); //显示搜索条件
// 定时任务表格数据
let jobList = reactive([]);
let title = ref(''); //弹出层标题
let open = ref(false); //是否显示弹出层
let openView = ref(false); //是否显示详细弹出层
let expression: UnwrapRef<string> = ref(''); //传入的表达式
let queryParams = reactive({
  jobName: '',
  jobGroup: '',
  status: ''
}); //传入的表达式
// 表单参数
let form = reactive({
  id: '',
  jobName: '',
  jobGroup: '',
  invokeTarget: '',
  cronExpression: '',
  misfirePolicy: 1,
  concurrent: 1,
  status: 0
});
let searchForm = reactive({
  rptSearchValue: ''
});
let showLoading = ref(false); //刷新+表格加载
let jobTableList = reactive([]);
// 表单校验
let rules = {
  jobName: [
    {
      required: true,
      message: '任务名称不能为空',
      trigger: 'blur'
    }
  ],
  invokeTarget: [
    {
      required: true,
      message: '调用目标字符串不能为空',
      trigger: 'blur'
    }
  ],
  cronExpression: [
    {
      required: true,
      message: 'cron执行表达式不能为空',
      trigger: 'blur'
    }
  ]
};
let searchValue = ref('');
let formRef: any = ref(null); //弹框新增
let formRef2: any = ref(null); //弹框编辑 任务详细
let selectMainItemRow: any = reactive({});
const jobVsMainItemList = reactive([]);
const mainItemAllList = reactive([]);

// 方法使用区 ======================================
// 页面加载时字典
onMounted(() => {
  getList(); //任务列表
  getDictItemsList();
  getJobList();
});

function mergeRowMethod({ row, _rowIndex, column, visibleData }) {
  const fields = ['jobGroupName']
  const cellValue = row[column.field]
  if (cellValue && fields.includes(column.field)) {
    const prevRow = visibleData[_rowIndex - 1]
    let nextRow = visibleData[_rowIndex + 1]
    if (prevRow && prevRow[column.field] === cellValue) {
      return { rowspan: 0, colspan: 0 }
    } else {
      let countRowspan = 1
      while (nextRow && nextRow[column.field] === cellValue) {
        nextRow = visibleData[++countRowspan + _rowIndex]
      }
      if (countRowspan > 1) {
        return { rowspan: countRowspan, colspan: 1 }
      }
    }
  }
}

// 获取阶段类型字典
async function getDictItemsList() {
  let dictTreeTypeCodes: any = ['TASK_GROUP_NAME'];
  const codes = dictTreeTypeCodes.join(',');
  const url = '/api/sys/basDictDetail/findDictDetailListByDictCodes';
  const dictTreeTypeItems: any = await proxy.$http.get(url, { params: { code: codes } });
  const severityType = dictTreeTypeItems.data.find((item) => item.code === 'TASK_GROUP_NAME');
  groupList.push(...severityType.detailDataList);
}
/** 查询定时任务列表 */
function getList() {
  jobList.length = 0;
  tableLoading.value = true;
  const url = '/api/monitor/job/list';
  proxy.$http
    .get(url, { params: { jobName: queryParams.jobName, jobGroup: queryParams.jobGroup, status: queryParams.status } })
    .then((res: any) => {
      jobList.push(...res.data);
      console.log('jobList',jobList)
      tableLoading.value = false;
    })
    .catch((err) => {
      tableLoading.value = false;
      VxeMessage(err, VxeNotifyType.error);
    });
}
// 取消按钮
function cancel() {
  reset();
  open.value = false;
  openView.value = false;
}
// 表单重置
function reset() {
  let $formEl = formRef.value as any;
  let $formEl2 = formRef2.value as any;
  if ($formEl) {
    $formEl.resetFields();
  }

  if ($formEl2) {
    $formEl2.resetFields();
  }

  form.id = '';
  form.jobName = '';
  form.jobGroup = '';
  form.invokeTarget = '';
  form.cronExpression = '';
  form.misfirePolicy = 1;
  form.concurrent = 1;
  form.status = 0;
}

/** 搜索按钮操作 */
function handleQuery() {
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  queryParams.jobName = '';
  queryParams.jobGroup = '';
  queryParams.status = '';
  handleQuery();
}

// 更多操作触发
function handleCommand(command, row) {
  switch (command) {
    case 'handleRun':
      handleRun(row);
      break;
    case 'handleView':
      handleView(row);
      break;
    default:
      break;
  }
}
// 任务状态修改
function handleStatusChange(row) {
  let text = row.status === '0' ? '启用' : '停用';
  proxy
    .$confirm('确认要"' + text + '""' + row.jobName + '"任务吗？', '提示', {
      cancelButtonClass: 'cancel-button',
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {
      const url = '/api/monitor/job/changeStatus';
      proxy.$http
        .post(url, row)
        .then((res: any) => {
          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          row.status = row.status === '0' ? '1' : '0';
          VxeMessage(err, VxeNotifyType.error);
        });
    });
}

/* 立即执行一次 */
function handleRun(row) {
  proxy
    .$confirm('确认要立即执行一次"' + row.jobName + '"任务吗？', '提示', {
      cancelButtonClass: 'cancel-button',
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {
      const url = '/api/monitor/job/run';
      proxy.$http
        .put(url, row)
        .then((res: any) => {
          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          VxeMessage(err, VxeNotifyType.error);
        });
    });
}

/** 任务详细信息 */
function handleView(row) {
  const url = '/api/monitor/job/' + row.id;
  proxy.$http
    .get(url)
    .then((res: any) => {
      Object.assign(form, res.data);
      openView.value = true;
    })
    .catch((err: any) => {
      VxeMessage(err, VxeNotifyType.error);
    });
}

/** 确定后回传值 */
function crontabFill(value) {
  form.cronExpression = value;
}

/** 新增按钮操作 */
function handleAdd() {
  reset();
  open.value = true;
  title.value = '添加任务';
}

/** 修改按钮操作 */
function handleUpdate(row) {
  reset();
  const id = row.id || this.ids;
  title.value = '修改任务';
  const url = '/api/monitor/job/' + row.id;
  proxy.$http
    .get(url)
    .then((res: any) => {
      Object.assign(form, res.data);
      title.value = '修改任务';
      proxy.$nextTick(() => {
        open.value = true;
      });
    })
    .catch((err: any) => {
      VxeMessage(err, VxeNotifyType.error);
    });
}

/** 提交按钮 */
function submitForm() {
  proxy.$refs['formRef'].validate((valid) => {
    if (valid) {
      if (!IsEmpty(form.id)) {
        const url = '/api/monitor/job/updateStatus';
        proxy.$http
          .post(url, form)
          .then((res: any) => {
            VxeMessage(res.status.msg, VxeNotifyType.success);
            open.value = false;
            getList();
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      } else {
        const url = '/api/monitor/job';
        proxy.$http
          .post(url, form)
          .then((res: any) => {
            VxeMessage(res.status.msg, VxeNotifyType.success);
            open.value = false;
            getList();
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      }
    }
  });
}
/** 删除按钮操作 */
function handleDeleteBatch() {
  const addInstrList = [];
  const selectRows = (proxy.$refs.tableRef as any).getCheckboxRecords();
  if (selectRows.length > 0) {
    for (const sltRow of selectRows) {
      addInstrList.push(sltRow.id);
    }
  } else {
    VxeMessage('请选择需要删除的定时任务', VxeNotifyType.warning);
    return;
  }
  const data = {
    ids: addInstrList
  };
  proxy
    .$confirm('是否确认删除定时任务数据项？', '提示', {
      cancelButtonClass: 'cancel-button',
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {
      const url = '/api/monitor/job/deleteJobs';
      proxy.$http
        .post(url, data)
        .then((res: any) => {
          getList();
          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          VxeMessage(err, VxeNotifyType.error);
        });
    });
}
/** 删除按钮操作 */
function handleDelete(row) {
  const addInstrList = [];
  addInstrList.push(row.id);
  const data = {
    ids: addInstrList
  };
  proxy
    .$confirm('是否确认删除定时任务编号为"' + ids + '"的数据项？', '提示', {
      cancelButtonClass: 'cancel-button',
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {
      const url = '/api/monitor/job/deleteJobs';
      proxy.$http
        .post(url, data)
        .then((res: any) => {
          getList();
          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          VxeMessage(err, VxeNotifyType.error);
        });
    });
}
// 获取报告单元列表
function getJobList() {
  jobTableList.length = 0;
  showLoading.value = true;
  const url = '/api/monitor/job/list';
  proxy.$http
    .get(url, { params: { jobName: searchForm.rptSearchValue } })
    .then((res: any) => {
      jobTableList.length = 0;
      jobTableList.push(...res.data);
      if (jobTableList.length > 0) {
        rptRowClick({ row: jobTableList[0] });
      }
      showLoading.value = false;
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
      showLoading.value = false;
    });
}
// 点击当前行// 行点击事件
function rptRowClick({ row }: any) {
  (proxy.$refs.labJobTable as any).setCurrentRow(row);
  selectMainItemRow = row;
  findMainItemByJobList(row.id);
  getMainItemList(row.id);
}

// 获取中间的报告单元信息
function findMainItemByJobList(id: string) {
  jobVsMainItemList.length = 0;
  const url = '/api/qi/qiJobVsMainitem/findQiJobVsMainitemList';
  proxy.$http
    .get(url, { params: { jobId: id } })
    .then((res: any) => {
      jobVsMainItemList.push(...res.data);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}
// 获取右侧列表
function getMainItemList(id: string) {
  mainItemAllList.length = 0;
  showLoading.value = true;
  const url = '/api/qi/qiJobVsMainitem/findQiItemList';
  let obj = {
    keyWords: searchValue.value,
    joinId: id
  };
  proxy.$http
    .get(url, { params: { keyWords: searchValue.value, jobId: id } })
    .then((res: any) => {
      mainItemAllList.push(...res.data);
      showLoading.value = false;
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
      showLoading.value = false;
    });
}

//mainItemRowClick
function mainItemRowClick({ row }: any) {
  const url = '/api/qi/qiJobVsMainitem/addQiJobVsMainitem';
  let addRptVsBarCode = {
    jobId: selectMainItemRow.id,
    indexId: row.indexId,
    itemId: row.id,
    indexCode: row.indexCode,
    itemCode: row.itemCode
  };
  proxy.$http
    .post(url, addRptVsBarCode)
    .then((res: any) => {
      findMainItemByJobList(selectMainItemRow.id);
      getMainItemList(selectMainItemRow.id);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}

// 删除数据
function deleteQiJobVsMainitem({ row }: any) {
  const url = '/api/qi/qiJobVsMainitem/deleteQiJobVsMainitem';
  proxy.$http
    .post(url, {
      id: row.id
    })
    .then((res: any) => {
      findMainItemByJobList(selectMainItemRow.id);
      getMainItemList(selectMainItemRow.id);
      VxeMessage(res.status.msg, VxeNotifyType.success);
    })
    .catch((err: any) => {
      VxeMessage(err, VxeNotifyType.error);
    });
}
</script>
<style lang="scss" scoped>
#job {
  width: 100%;
  height: 100%;

  .bodyContent {
    height: calc(100% - 60px);

    .contentDiv {
      height: 100%;
      background-color: $base-white;

      // 附加按钮间距
      .button-blue,
      .button-red {
        margin: 5px 5px 5px 0;
      }

      .vxe-form {
        :deep(.vxe-form--item) {
          margin-right: 10px;
        }
      }

      .tableBox {
        height: calc(100% - 40px);
      }
    }
  }
  .leftTable {
    height: calc(100% - 30px);
  }
  :deep(.el-tabs) {
    height: 100%;
  }
  :deep(.el-tabs__content) {
    padding: 0;
    height: calc(100% - 40px);
    .el-tab-pane {
      height: 100%;
    }
  }
}
</style>

<style lang="scss">
.addEditTaskDialog {
  .el-form {
    .el-form-item {
      margin-bottom: 20px;
    }
  }

  .dialogFooter {
    .el-button {
      float: right;
      margin-left: 10px;
    }
  }
}
.taskLogDetailDialog {
  height: 300px;
  .el-dialog__body {
    padding: 10px;
    .dialogFooter {
      margin: 10px;
      .el-button {
        float: right;
      }
    }
  }
}
</style>
